{% extends 'base.html' %}
{% load static from staticfiles %}

{% block body %}
    <!-- 内容主体区域 -->
    <div class="layui-tab-item layui-show">
        <div class="layui-fluid">
            <div class="layui-col-md12" style="padding: 7.5px;">
                <div class="layui-card">
                    <div class="layui-card-header">
                        菜单管理
                    </div>
                    <div class="layui-card-body">
                        <table id="table" lay-filter="table"></table>
                    </div>

                </div>
            </div>
        </div>
    </div>
{% endblock %}
{% block scripts %}
    <script>
        layui.use('table', function () {
            var table = layui.table;      //表格
            //table实例
            table.render({
                elem: '#table'
                , height: 450
                , url: '{{ path }}/menu_data' //数据接口
                , page: true //开启分页
                , toolbar: 'default' //默认操作行
                , loading: true //加载条
                , cols: [[
                    {checkbox: true, sort: true, fixed: 'left'}
                    , {title: '序号',type: 'numbers', sort: true, fixed: 'left', width: 70,}
                    , {field: 'id', title: 'ID', width: 100, sort: true, fixed: 'left'}
                    , {field: 'name', title: '菜单名称', width: 400}
                    , {field: 'tree_id', title: '树id', width: 600}
                    , {
                        fixed: 'right',
                        title: '操作',
                        width: 300,
                        align: 'center',
                        templet: function (d) {
                            return '  <a class="layui-btn layui-btn-xs" lay-event="detail">查看</a>  <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>\n' +
                                '  <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>'
                        }
                    }

                ]]
            });
        })
    </script>
{% endblock %}